$(function () {
  //公告管理 打开窗口
  $('.notice-trigger').on('click', function (event) {
    event.preventDefault();
    $('.notice-pop').addClass('is-visible3');
    $('#noticeModal input').val('');
    noticePageList(1);
  });
  //公告管理 关闭窗口
  $('.notice-pop').on('click', function (event) {
    if (
      $(event.target).is('.cd-popup-close') ||
      $(event.target).is('.notice-pop')
    ) {
      event.preventDefault();
      $(this).removeClass('is-visible3');
    }
  });


  // 全选 反选
  $("#noticeTableSelectAll").on("click", function () {
    var allcheck = $("#noticeTableSelectAll").prop("checked");
    $("#noticeModal tbody .check").prop("checked", allcheck);
  });
  // 反选
  $("#noticeModal tbody").on("click", '.check', function () {
    var length1 = $("#noticeModal tbody").find(":checkbox").length;
    var length2 = $("#noticeModal tbody").find(":checked").length;
    if (length1 == length2) {
      $("#noticeTableSelectAll").prop("checked", true);
    } else {
      $("#noticeTableSelectAll").prop("checked", false);
    }
  });
  //  删除公告
  $("#noticeDelBtn").on('click', function () {
    if ($('#noticeModal tbody input[type=checkbox]:checked').length > 0) {
      $('#noticeDelBox').addClass('is-visible3');
    }

  });
  $("#noticeDelBox .delConfirm").on('click', function () {
    $('#noticeModal tbody input[type=checkbox]:checked').each(function () {
      var thisid = $(this).attr('thisid');
      var obj = {};
      obj.id = thisid
      jsonData = JSON.stringify(obj);
      $.ajax({
        url: '/info/delNotice?id=' + thisid,
        type: 'delete',
        data: jsonData,
        contentType: 'application/json',
        async: false,
        success: function (res) {
          console.log(res)

        }
      });
    });
    if ($("#noticeTableSelectAll").prop("checked")) {
      noticePage = noticePage - 1;
      if (noticePage < 1) {
        noticePage = 0;
      }
    }
    noticePageList(noticePage);
    // 微型消防站管理 获取总页数 点击分页渲染列表
    noticePageFunc(noticePage);
    $('#noticeTableSelectAll').prop('checked', false)
    tipModalFunc('删除成功!');
    $('#noticeDelBox').removeClass('is-visible3');
  });
  var noticePage = 1;
  var noticePageNum = 1;

  function noticePageFunc(pageSum, startPageNum) {
    console.log(pageSum);
    if (pageSum <= 1) {
      $('#noticePageBox .pageJump').hide();
    } else {
      $('#noticePageBox .pageJump').show();
    }
    Page({
      num: pageSum, //页码数
      startnum: startPageNum, //指定页码
      elem: $('#noticePage'), //指定的元素
      callback: function (n) { //回调函数
        console.log(n)
        noticePage = n;
        noticePageList(n);
        // 当翻到下一页时 清除掉 全选按钮的 选中状态
        $("#noticeTableSelectAll").prop("checked", false);
      }
    });
  }
  var editNoticeArr = [];
  // 渲染 公告 列表
  function noticePageList(n) {
    //hasExpired 是否过期 (true过期 false未过期)
    $('#noticeModal .tableBox tbody').html('');
    var page = n - 1;
    var startTime = $('#noticeModal .startTime').val() ? $('#noticeModal .startTime').val() + ' 00:00:00' : '2018-01-01 00:00:00';
    var endTime = $('#noticeModal .endTime').val() ? $('#noticeModal .endTime').val() + ' 23:59:59' : '2118-01-01 00:00:00';
    var size = 10;

    // 获取公告列表
    $.ajax({
      url: '/info/getNotice?beginTime=' + startTime + '&endTime=' + endTime + '&page=' + page + '&size=' + size,
      success: function (res) {
        console.log(res);
        if (res.status == 200) {
          noticePageNum = res.data.totalPages;
          var data = res.data.content;
          editNoticeArr = data;
          var size = res.data.size;
          for (var i = 0; i < data.length; i++) {
            var hasExpired = '';
            var title = data[i].title;
            if (data[i].hasExpired) {
              hasExpired = '已结束';
              classStr = 'colorff4242';
            } else {
              hasExpired = '发布中';
              classStr = 'color32ffd9';
            }
            if (title.length > 22) {
              title = title.slice(0, 22) + ' . . .';
            }
            // 22字
            $('#noticeModal .tableBox tbody').append(`<tr>
            <td><input type="checkbox" class="check" thisid="` + data[i].id + `"/></td>
            <td>` + ((n - 1) * size + i + 1) + `</td>
            <td>` + title + `</td>
            <td>` + data[i].startTime + `</td>
            <td>` + data[i].endTime + `</td>
            <td class="` + classStr + `">` + hasExpired + `</td>
            <td>
              <span class="seeBtnStyle editNotice-trigger" index="` + i + `" thisid="` + data[i].id + `">查看详情</span>
            </td>
          </tr>`);
          }
          $("#noticeTableSelectAll").prop("checked", false);
          noticePageFunc(noticePageNum, n)
        }
      }
    })
  }

  // 点击搜索，按时间查询
  $('#noticeSearchBtn').click(function () {
    noticePageList(1);
  });

  //    公告添加
  // $('.addNotice-pop').addClass('is-visible3');
  //公告管理添加 打开窗口
  $('.addNotice-trigger').on('click', function (event) {
    event.preventDefault();
    $('.addNotice-pop').addClass('is-visible3');
  });
  //公告管理添加 关闭窗口
  $('.addNotice-pop').on('click', function (event) {
    if ($(event.target).is('.cd-popup-close') || $(event.target).is('.addNotice-pop')) {
      // 
      event.preventDefault();
      $(this).removeClass('is-visible3');
      clearAddNotice();
    }
  });

  // 初始化富文本编辑，上传图片
  var E = window.wangEditor;

  var editor = new E('#noticeContent');
  editor.customConfig.uploadImgServer = '/info/uploadPic';
  editor.customConfig.uploadImgHooks = {
    customInsert: function (insertImg, result, editor) {
      console.log(JSON.stringify(result));
      insertImg(result.data[0]);
    },

    customInsert: function (insertImg, result, editor) {
      console.log(result);
      for (var i = 0; i < result.data.length; i++) {
        insertImg(result.data[i]);
      }
    }
  };

  editor.customConfig.uploadImgParamsWithUrl = true;
  editor.create();
  // 提交公告信息
  $('#addNoticeBtn').on('click', function () {
    var html = editor.txt.html();
    var obj = {};
    var jsonData = '';
    var title = $('#addNoticeModal .notice_title input').val();
    var startTime = moment().format('YYYY-MM-DD HH:mm:ss');
    var endTime = $('#addNoticeModal .noticeDateEnd').val();
    obj.content = html;
    obj.title = title;
    obj.startTime = startTime;
    obj.endTime = endTime;
    jsonData = JSON.stringify(obj);
    if (!title || !startTime || !endTime || !html) {
      tipModalFunc('请填写完整内容!');
      return;
    }
    $.ajax({
      url: '/info/putNotice',
      data: jsonData,
      type: 'post',
      contentType: 'application/json',
      success: function (res) {
        console.log(res);
        $('.addNotice-pop').removeClass('is-visible3');
        noticePageList(noticePage);
        // 微型消防站管理 获取总页数 点击分页渲染列表
        noticePageFunc(noticePage);
        clearAddNotice();
      }
    });
  });
  // 清空公告添加数据
  function clearAddNotice() {
    $('#addNoticeModal .notice_title input').val('');
    $('#addNoticeModal .notice_title noticeDateEnd').val('');
    editor.txt.html('');

  }
  $('.J-datepicker-end').datePicker({
    hasShortcut: false,
    min: moment().format('YYYY-MM-DD HH:mm:ss'),
    max: '2100-12-12 23:59:59',
    shortcutOptions: [{
        name: '今天',
        day: '0'
      },
      {
        name: '昨天',
        day: '-1',
        time: '00:00:00'
      },
      {
        name: '一周前',
        day: '-7'
      }
    ],
    hide: function () {
      console.info(this);
    },
    show: function () {
      console.log(this);
      var left = $('.c-datepicker-picker').eq(0).css('left');
      var index = left.indexOf('p');
      left = +left.substr(0, index) + 92.5 + 'px';
      console.log(left);
      $('.c-datepicker-picker')
        .eq(0)
        .css({
          left: left
        });

    }
  });

  //时分秒年月日单个
  $('.J-datepicker').datePicker({
    hasShortcut: false,
    min: moment().format('YYYY-MM-DD HH:mm:ss'),
    max: '2100-12-12 23:59:59',
    shortcutOptions: [{
        name: '今天',
        day: '0'
      },
      {
        name: '昨天',
        day: '-1',
        time: '00:00:00'
      },
      {
        name: '一周前',
        day: '-7'
      }
    ],
    hide: function () {
      console.info(this);
      $('.c-datepicker-picker')
        .eq(0)
        .css({
          left: 0
        });
      // $('.c-datepicker-picker').remove();
    },
    show: function () {

      console.log(this);
      var left1 = $('.c-datepicker-picker').eq(1).css('left');
      var index = left1.indexOf('p');
      left1 = +left1.substr(0, index) + 92.5 + 'px';
      console.log(left1);
      $('.c-datepicker-picker')
        .eq(1)
        .css({
          left: left1
        });
    }
  });
  var noticeIndex = '';
  //公告管理修改 打开窗口
  $('#noticeModal').on('click', '.editNotice-trigger', function (event) {
    event.preventDefault();
    $('.editNotice-pop').addClass('is-visible3');
    var index = $(this).attr('index');
    noticeIndex = index;
    var arr = editNoticeArr[index];
    var id = arr.id;
    var title = arr.title;
    var content = arr.content;
    var endTime = arr.endTime;
    console.log(endTime)
    $('#editNoticeModal .notice_title .notice_title_val').val(title);
    $('#editNoticeModal .notice_title .noticeDateEnd').val(endTime);
    editor1.txt.html(content);

    // 点击查看详情时，只查看不修改
    $('#editNoticeModal input').attr('disabled', 'disabled');
    $('#editNoticeModal select').attr('disabled', 'disabled');
    $('#editNoticeModal select').addClass('disabledStyle');
    $('#editNoticeModal input').addClass('disabledStyle');
    delTouxiangFlag = false;
    $('#editNoticeModal .allowEdit').show();
    $('#editNoticeBtn').hide();
    // 禁用编辑功能
    editor1.$textElem.attr('contenteditable', false);
  });

  var delTouxiangFlag = false;
  // 点击修改时,可以修改编辑
  $('#editNoticeModal .allowEdit').on('click', function () {
    delTouxiangFlag = true;
    $('#editNoticeModal .allowEdit').hide();
    $('#editNoticeBtn').show();
    $('#editNoticeModal input').removeAttr('disabled');
    $('#editNoticeModal select').removeAttr('disabled');
    $('#editNoticeModal select').removeClass('disabledStyle');
    $('#editNoticeModal input').removeClass('disabledStyle');
    editor1.$textElem.attr('contenteditable', true);

  });

  // 点击修改按钮
  $('#editNoticeBtn').on('click', function () {
    var html = editor1.txt.html();
    var obj = {};
    var jsonData = '';
    var title = $('#editNoticeModal .notice_title input').val();
    var startTime = moment().format('YYYY-MM-DD HH:mm:ss');
    var endTime = $('#editNoticeModal .noticeDateEnd').val();
    var arr = editNoticeArr[noticeIndex];
    var id = arr.id;
    obj.content = html;
    obj.title = title;
    obj.startTime = startTime;
    obj.endTime = endTime;
    obj.id = id;
    jsonData = JSON.stringify(obj);
    if (!title || !startTime || !endTime || !html) {
      tipModalFunc('请填写完整内容!');
      return;
    }
    $.ajax({
      url: '/info/putNotice',
      data: jsonData,
      type: 'post',
      contentType: 'application/json',
      success: function (res) {
        console.log(res);
        $('.editNotice-pop').removeClass('is-visible3');
        noticePageList(noticePage);
        // 微型消防站管理 获取总页数 点击分页渲染列表
        noticePageFunc(noticePage);
        clearAddNotice();
      }
    });
  });
  //公告管理修改 关闭窗口
  $('.editNotice-pop').on('click', function (event) {
    if ($(event.target).is('.cd-popup-close') || $(event.target).is('.editNotice-pop')) {
      event.preventDefault();
      $(this).removeClass('is-visible3');
      clearEditNotice();
    }
  });

  // 初始化富文本编辑，上传图片
  var E1 = window.wangEditor;

  var editor1 = new E1('#noticeContentEdit');
  editor1.customConfig.uploadImgServer = '/info/uploadPic';
  editor1.customConfig.uploadImgHooks = {
    customInsert: function (insertImg, result, editor1) {
      console.log(JSON.stringify(result));
      insertImg(result.data[0]);
    },

    customInsert: function (insertImg, result, editor1) {
      console.log(result);
      for (var i = 0; i < result.data.length; i++) {
        insertImg(result.data[i]);
      }
    }
  };

  editor1.customConfig.uploadImgParamsWithUrl = true;
  editor1.create();
  // 清空公告添加数据
  function clearEditNotice() {
    $('#editNoticeModal .notice_title input').val('');
    $('#editNoticeModal .notice_title noticeDateEnd').val('');
    editor1.txt.html('');

  }
});